@import '~static/sass/mixin'
@import '~static/sass/color'
@import '~static/sass/var'

.container
  +border-box
  padding-bottom: $navHeight

.user
  +border-box
  padding: $spacing*2
  +font-dpr(10px)

  .user-header
    padding: $spacing*2 0
    font-size: 2.5em
    text-align: right

    .text
      float: left

    img
      width: 1.5rem
      height: 1.5rem
      display: inline-block
      border-radius: 50%
    

  .user-address, .user-phone, .user-name, .user-order
    padding: $spacing/2 0
    border-top: 1px solid $grey-400

    .user-content
      font-size: 1.8em
  
  .user-order
    .user-order-items
      width: 100%
      height: 2.5rem
      margin-top: $spacing/2
      font-size: 0

      > *
        display: inline-block
        height: 100%
        vertical-align: top
        +font-dpr(10px)
      
      img
        width: 25%
      
      .user-order-intro
        width: 50%
        margin-left: 5%
        border-bottom: 1px solid $grey-300
        color: $grey-700

        .title
          padding-top: 3px
          font-size: 1.5em

        .content
          font-size: 1.25em
      
      .user-order-price
        width: 20%
        border-bottom: 1px solid $grey-300
        text-align: center
        color: $white
        
        span
          display: inline-block
          width: 100%
          margin-top: 5px
          padding: 3px 0
          background: $grey-800
